<template>
    <div class="detail" >
        <div class="detail-content">
            <mavon-editor
            class="mavon"
            ref="editor"
            :value="content"
            :subfield="false"
            :defaultOpen="'preview'"
            :toolbarsFlag="false"
            :editable="false"
            :scrollStyle="true"
            :ishljs="true"
          >
          </mavon-editor>
        </div>
    </div>
</template>

<script>
import { mavonEditor } from "mavon-editor";
import "../../assets/styles/_highlight.scss";
export default {
    name:'Article',
        components: {
        mavonEditor,
        // write,
        // commentlist
    },
    data(){
        return {
            content: "",
        }
    },
    methods:{
        async getDetail() {
            let params = {
                id: this.$route.query.id
            };
            console.log(params)
            const { data } = await this.$api.getArticleDetail(params);
            this.content = data.content;
            console.log(this.content)
        }
    },
    mounted() {
        this.getDetail();
    }
    }
</script>
<style lang="scss" scoped>
.detail{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
    margin-bottom: 10px;
    .detail-content{
        width: 80%;
        min-height: 600px;
        background-color: #fff;
        .v-note-wrapper {
           
        }
    }
}
</style>